<!--
 * @Descripttion: 
 * @Version: 
 * @Author: gaohj
 * @Date: 2023-01-13 11:19:04
 * @LastEditors: Please set LastEditors
 * @LastEditTime: 2023-01-13 11:28:56
-->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <table>
        <thead>
            <tr>
                <th>编号</th>
                <th>姓名</th>
                <th>年龄</th>
                <th>性别</th>
                <th>薪资</th>
            </tr>
        </thead>
        <tbody>
            
        </tbody>
    </table>
    <script>
        var persons = [
            {id:1,name:'张三',age:18,gender:'男',salary:10000},
            {id:2,name:'李四',age:19,gender:'男',salary:8000},
            {id:3,name:'王五',age:21,gender:'女',salary:7000},
            {id:4,name:'赵六',age:20,gender:'男',salary:5000},
            {id:5,name:'鬼脚七',age:30,gender:'不详',salary:9000},
            {id:6,name:'王八',age:28,gender:'男',salary:8000},
        ]


            // 构建 字符串  放到 tbody  字符串累加  
            // <tr>
            // <td>1</td>
            //     <td>张三</td>
            //     <td>张三</td>
            //     <td>张三</td>
            //     <td>张三</td>
            // </tr>

            var str = ''; //用来拼接的字符串 

                persons.forEach(function(item){
                   str +=  `
                    <tr>
                        <td>${item.id}</td>
                        <td>${item.name}</td>
                        <td>${item.age}</td>
                        <td>${item.gender}</td>
                        <td>${item.salary}</td>
                    </tr>
                    <tr>
                        <td>${item.id}</td>
                        <td>${item.name}</td>
                        <td>${item.age}</td>
                        <td>${item.gender}</td>
                        <td>${item.salary}</td>
                    </tr>
                
                `
            });
            var tbody = document.querySelector('tbody');
            tbody.innerHTML = str;


        
    </script>
</body>
</html>